const path = require("path")
const htmlWebpackPlugin = require("html-webpack-plugin")

module.exports = {
    mode: 'development',
    devtool: 'inline-source-map',
    //devServer服务启动目录
    devServer: {
        static: './dist'
    },
    optimization: {
        moduleIds: 'deterministic',//防止依赖中的文件修改全部都新生成文件
        runtimeChunk: 'single',
        splitChunks: {
            cacheGroups: {
                vendor: {
                    //node_modules 中的代码单独拆分到一个js文件； 他们大多是不太会改变的
                    test: /[\\/]node_modules[\\/]/,
                    name: 'vendors',
                    chunks: 'all',
                },
            },
        }
    },
    entry: {
        main: './main.js',
    },//入口
    output: {
        filename: "[name].[hash].js",//[hash] 根据文件内容生成
        path: path.resolve(__dirname, "dist"),
        clean: true,
    },
    plugins: [
        //如果要修改标题，index.html 中需要读取这个title <%= htmlWebpackPlugin.options.title %>
        new htmlWebpackPlugin({
            template: "./index.html",
            title: 'Cache',
        }),
    ],
    module: {
        rules: []
    }
}



